<template>
  <div class="w-full h-full">
    <mci-label class="pt-0 pb-8">
      {{ '字段管理.手动添加' }}
    </mci-label>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column :prop="manualTableColsMap.get('columnCode')" label="指标标识" width="180" />
      <el-table-column :prop="manualTableColsMap.get('columnName')" label="指标名称" width="180" />
      <el-table-column :prop="manualTableColsMap.get('columnDataType')" label="数据类型" width="180" />
      <el-table-column :prop="manualTableColsMap.get('columnAddType')" label="来源" />
      <el-table-column :prop="manualTableColsMap.get('columnTip')" label="描述" />
    </el-table>
    <mci-label class="pt-16 pb-8">
      {{ '字段管理.数据库' }}
    </mci-label>
    <el-table :data="tableData2" border style="width: 100%">
      <el-table-column :prop="dataSourceTableColsMap.get('columnCode')" label="指标标识" width="180" />
      <el-table-column :prop="dataSourceTableColsMap.get('columnName')" label="指标名称" width="180" />
      <el-table-column :prop="dataSourceTableColsMap.get('columnDataType')" label="数据类型" width="180" />
      <el-table-column :prop="dataSourceTableColsMap.get('columnAddType')" label="来源" />
      <el-table-column :prop="dataSourceTableColsMap.get('columnKey')" label="是否主键" />
      <el-table-column :prop="dataSourceTableColsMap.get('columnAllowNull')" label="是否允许为空" />
    </el-table>
  </div>
</template>

<script lang="ts" setup>
import { MciLabel } from '@/components/base';
import { ElTable } from 'element-plus';
import { ref } from 'vue';

import { dataSourceTableColsMap, manualTableColsMap } from './data';

// 表格
const rowData = {};
rowData[manualTableColsMap.get('columnCode')] = '001';
rowData[manualTableColsMap.get('columnName')] = '营业额';
rowData[manualTableColsMap.get('columnDataType')] = '数字';
rowData[manualTableColsMap.get('columnAddType')] = '手动添加';
rowData[manualTableColsMap.get('columnTip')] = '每天上报的营业额';
const tableData = ref([rowData]);

// 表格
const rowData2 = {};
rowData2[dataSourceTableColsMap.get('columnCode')] = '001';
rowData2[dataSourceTableColsMap.get('columnName')] = '北区';
rowData2[dataSourceTableColsMap.get('columnDataType')] = '东区 南区 西区 北区';
rowData2[dataSourceTableColsMap.get('columnAddType')] = '数据源导入';
rowData2[dataSourceTableColsMap.get('columnKey')] = '否';
rowData2[dataSourceTableColsMap.get('columnAllowNull')] = '否';
const tableData2 = ref([rowData2]);
</script>
